<template>
  <Modal
      title="折扣价格"
      :show="show"
      @ok="handleOk"
      @cancel="handleCancel"
  >
    <div class="ProductDiscountModal">
      <n-form
          label-placement="left"
          :label-width="80"
          size="medium"
          ref="form"
      >
        <n-row :gutter="24">
          <n-col :span="24">
            <n-form-item  label="折扣价格">
              <n-input-number style="width: 100%" placeholder="请输入折扣价格" v-model:value="formModal.discount"/>
            </n-form-item>
          </n-col>
        </n-row>
      </n-form>
    </div>
  </Modal>
</template>

<script lang="ts">
export default {
  name: "ProductDiscountModal"
}
</script>

<script setup lang="ts">
import {onMounted, reactive, ref} from "vue"
import useMsg from '@/hooks/useMsg'
import Modal from '@/components/Modal.vue'
import {DiscountType} from '@/view/shopping/product/productType'
import {sms_product_discount} from '@/api/sms'
const {success, error} = useMsg()

const show = ref<boolean>(false)

const emit = defineEmits<{
  (e: 'list'):void
}>()

const formModal = reactive<DiscountType>({
  product_id: "",
  discount: 0
})

function init (product_id: string, discount: number) {
  show.value = true
  formModal.product_id = product_id
  formModal.discount = discount
}

const handleOk = () => {
  sms_product_discount(formModal).then(res => {
    if (res.code === 200) {
      success(res.message)
      show.value = false
      emit("list")
    } else {
      error(res.message)
    }
  })
}

const handleCancel = () => {
  show.value = false
}

defineExpose({
  init
})

onMounted( () => {
} )
</script>

<style scoped lang="scss">

</style>
